<template>
  <div>
    <!-- <div :id="divPlugin" :style="pluginStyle"></div> -->
    <div class="divPlugin_box" style="font-size: 0; height: calc(100% - 35px)">
      <iframe class="iframe" :src="'/static/iframe.html?timestamp=' + timestamp + '&showScreen=' + showScreen" frameborder="0" :style="pluginStyle">
      </iframe>
    </div>
    <div v-if="screenFlag" style="background: rgb(238, 238, 238); padding: 5px 0; text-align: right">
      <img src="~@/assets/images/screen_one.png" title="单屏" @click="splitScreen(1)" style="width: 25px; margin: 0 5px; cursor: pointer" />
      <img src="~@/assets/images/screen_four.png" title="四分屏" @click="splitScreen(2)" style="width: 25px; margin: 0 5px; cursor: pointer" />
      <img src="~@/assets/images/screen_nine.png" title="九分屏" @click="splitScreen(3)" style="width: 25px; margin: 0 5px; cursor: pointer" />
      <!-- <img src="~@/assets/screen_sixteen.png" title="十六分屏" @click="splitScreen(4)"
                style="width: 25px; margin: 0 5px; cursor: pointer;"> -->
    </div>
  </div>
</template>
<script>
// import { getAction } from '@/api/manage'
import { getNvrList } from '@/api/video.js';
import { useMessage } from '/@/hooks/web/useMessage';
export default {
  name: 'videoView',
  props: {
    // 通道号
    iChannelID: {
      type: Array,
    },
    // 云台速度
    speed: {
      type: Number,
      default: 4,
    },
    divPlugin: {
      type: String,
      default: 'divPlugin',
    },
    // 分屏
    showScreen: {
      type: Number,
      default: 1,
    },
    screenFlag: {
      type: Boolean,
      default: false,
    },
    // 弹窗
    popupFlag: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      g_iWndIndex: 0,
      pluginStyle: {},
      g_bPTZAuto: false,
      screenNum: 3,
      iChannelIDWindow: [],
      /*  */
      iLoadedCount: 0,
      g_aIframe: '',
      nvripList: [],
      timer: null,
      timestamp: '',
      doublreFlag: false,
      indexActive: 0,
      timer2: null,
      monitorList: [],
    };
  },
  mounted() {
    window.addEventListener('message', this.iframeEvent, false);
    // this.clickLogoin();

    /**
     * 录像机列表
     */
    // var list1 = [];
    // await getNvrList({}).then((res) => {
    //   list1 = res;
    //   this.prouctInfo = res[0];
    // });

    // Promise.all([
    //     getAction('/depotsecurity/depotSecurity/totalList'),
    //     getAction('/nvr/graindepotNvr/getNvrlist'),
    // ]).then((res) => {
    //     console.log(res)
    //     let monitorList = {}
    //     let data = res[0].result
    //     let nvrlist = res[1].result

    //     for (let i = 0; i < nvrlist.length; i++) {
    //         var list = data.filter((item) => item.nvripList == nvrlist[i].deviceIp)
    //         monitorList[nvrlist[i].deviceIp] = JSON.parse(JSON.stringify(list))
    //     }
    //     this.monitorList = monitorList
    // })
  },
  beforeDestroy() {
    window.removeEventListener('message', this.iframeEvent);
    let that = this;
    $.each(this.g_aIframe, (i, oIframe) => {
      // console.log(this.getWebVideoCtrl(oIframe))
      var szDeviceIdentify = that.nvripList[that.indexActive].szIP + '_' + that.nvripList[that.indexActive].szPort;
      if (this.getWebVideoCtrl(oIframe)) {
        this.getWebVideoCtrl(oIframe).I_Stop();
        this.getWebVideoCtrl(oIframe).I_Logout(szDeviceIdentify);
      }
    });
    clearInterval(this.timer2);
  },
  methods: {
    // 监听 g_iWndIndex 变化
    iframeEvent($event) {
      console.log($event);

      if (typeof $event.data == 'number') {
        this.g_iWndIndex = $event.data;
      }
      //   else if (typeof $event.data == 'string') {
      //     if ($event.data.split('_')[0] == 'dblclick') {
      //       let index_db = $event.data.split('_')[1];
      //       if (index_db == 0) {
      //         this.splitScreen(1);
      //       } else if (index_db <= this.iChannelID.length - 1) {
      //         // console.log(index_db)
      //         var that = this;
      //         let iType = parseInt(1, 10);
      //         $.each(this.g_aIframe, (i, oIframe) => {
      //           var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
      //           oWebVideoCtrl.I_ChangeWndNum(iType);
      //           that.screenNum = iType;
      //           that.$emit('checkedKeysChangeTwo', index_db);
      //         });
      //       }
      //     }
      //   }
    },
    // 登陆
    clickLogoin(nvrInfo) {
      console.log(555, nvrInfo);
      this.g_aIframe = document.querySelectorAll('iframe');
      var iRet = WebVideoCtrl.I_CheckPluginInstall();
      if (-1 == iRet) {
        alert('检测到新的插件版本，双击开发包目录里的WebComponentsKit.exe升级!');
        return;
      }
      //插件盒子宽高设置
      for (var i = 0; i < this.g_aIframe.length; i++) {
        let item = this.g_aIframe[i];
        var iWidth = item.clientWidth.toFixed(0);
        var iHeight = (400 * (iWidth / 600)).toFixed(0);
        item.style.width = iWidth + 'px';
        item.style.height = iHeight + 'px';
        this.pluginStyle = {
          width: iWidth + 'px',
          height: iHeight + 'px',
        };

        let that = this;

        // for (let i = 0; i < data.length; i++) {
        var nvripList = [];
        nvripList.push({
          szIP: nvrInfo.ip, // 登录ip地址
          szPort: nvrInfo.port, // 登录端口
          szUsername: nvrInfo.account, // 登录账号
          szPassword: nvrInfo.password, // 登录密码
          // szIP: '192.168.100.222', // protocol ip
          // szPort: '80', // protocol port
          // szUsername: 'admin', // device username
          // szPassword: 'wsn12345678', // device password
          iProtocol: nvrInfo.protocol * 1, // 网络协议 http, https
          iStreamType: nvrInfo.streamType * 1, // 码流
          // iPort: this.prouctInfo.rtspPort * 1, // rtsp端口（用于预览-可不传）
          // bZeroChannel: this.prouctInfo.zeroChannel == '1' ? true : false, // 是否启用零通道
        });
        // }
        that.nvripList = nvripList;
        // that.$set(that.nvripList[0], 'iChannelID', JSON.parse(JSON.stringify(that.iChannelID)))
        that.screenNum = that.showScreen;
        that.iChannelIDWindow = JSON.parse(JSON.stringify(that.iChannelID));

        that.$nextTick(() => {
          that.iframeLoaded();
          //   that.setTimeHandelLink();
        });
        // })
      }
    },
    //加载完
    iframeLoaded() {
      let that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        that.timestamp = Date.parse(new Date());
        setTimeout(() => {
          var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);

          oWebVideoCtrl.I_Login(
            that.nvripList[0].szIP,
            that.nvripList[0].iProtocol,
            that.nvripList[0].szPort,
            that.nvripList[0].szUsername,
            that.nvripList[0].szPassword,
            {
              success: (xmlDoc) => {
                console.log('登录成功');
                var szDeviceIdentify = that.nvripList[0].szIP + '_' + that.nvripList[0].szPort;
                setTimeout(() => {
                  //   var monitorList = that.monitorList[that.nvripList[that.indexActive].szIP];

                  for (let k = 0; k < that.iChannelIDWindow.length; k++) {
                    if (that.iChannelIDWindow[k]) {
                      //   var monitor = monitorList.filter((item) => {
                      //     return item.channelAnalog == that.iChannelIDWindow[k];
                      //   });

                      var iStreamType = that.nvripList[0].iStreamType;
                      console.log(777, k);

                      oWebVideoCtrl.I_StartRealPlay(szDeviceIdentify, {
                        iStreamType: iStreamType,
                        iWndIndex: k,
                        iChannelID: that.iChannelIDWindow[k],
                        // iChannelID: 1,
                        // bZeroChannel: that.nvripList[0].bZeroChannel,
                      });
                    }
                  }
                }, 1000);
              },
              error: (err) => {
                console.log(err);

                // var monitorList = that.monitorList[that.nvripList[that.indexActive].szIP];
                // for (let k = 0; k < 1; k++) {
                //   if (that.iChannelIDWindow[k]) {
                //     var monitor = monitorList.filter((item) => {
                //       return item.channelAnalog == that.iChannelIDWindow[k];
                //     });

                //     console.log(monitor);
                //   }
                // }
              },
            }
          );
        }, 1000);
      });
    },
    // 获取WebVideoCtrl
    getWebVideoCtrl(oIframe) {
      if (oIframe.contentWindow) {
        return oIframe.contentWindow.WebVideoCtrl;
      } else {
        return false;
      }
    },
    // 定时任务处理 流不稳定导致视频断开前端解决办法
    setTimeHandelLink() {
      this.timer2 = setInterval(() => {
        var that = this;
        // console.log(1)
        $.each(this.g_aIframe, (i, oIframe) => {
          // alert(i)
          var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
          var szDeviceIdentify = that.nvripList[0].szIP + '_' + that.nvripList[0].szPort;
          for (let k = 0; k < that.iChannelIDWindow.length; k++) {
            if (that.iChannelIDWindow[k] != undefined) {
              that.StopRealPlayRe(k);
            }
          }
          setTimeout(() => {
            oWebVideoCtrl.I_Logout(szDeviceIdentify);
            that.$emit('changeScreen', this.screenNum);
            that.iframeLoaded();
          }, 1000);
        });
      }, 300000);
    },
    //停止播放
    StopRealPlayRe(g_iWndIndex) {
      console.log(4444444);

      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);

        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(1, true, {
            iWndIndex: g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });

          oWebVideoCtrl.I_PTZControl(11, true, {
            iWndIndex: g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });

          oWebVideoCtrl.I_PTZControl(14, true, {
            iWndIndex: g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });

          oWebVideoCtrl.I_PTZControl(12, true, {
            iWndIndex: g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });

          oWebVideoCtrl.I_Stop({
            iWndIndex: g_iWndIndex,
            success: function () {},
            error: function () {},
          });
        }
      });
    },
    // 分屏
    splitScreen(iType) {
      console.log(6666666666);

      var that = this;
      iType = parseInt(iType, 10);
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        oWebVideoCtrl.I_ChangeWndNum(iType);
        this.screenNum = iType;
        //分屏时更改选中摄像头
        that.$emit('checkedKeysChange', iType);
        //分屏时更改选中摄像头
        //that.$emit('changeScreen', iType);
      });
    },
    // 录像机切换
    nvripChange(nvrip) {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var szDeviceIdentify = that.nvripList[that.indexActive].szIP + '_' + that.nvripList[that.indexActive].szPort;
        for (let k = 0; k < that.iChannelIDWindow.length; k++) {
          if (that.iChannelIDWindow[k] != undefined) {
            that.StopRealPlay(k);
          }
        }
        setTimeout(() => {
          oWebVideoCtrl.I_Logout(szDeviceIdentify);
          that.iChannelIDWindow = JSON.parse(JSON.stringify(that.iChannelID));
          // that.$set(that.nvripList[0], 'szIP', nvrip)
          for (let i = 0; i < that.nvripList.length; i++) {
            if (that.nvripList[i].szIP == nvrip) {
              that.indexActive = i;
            }
          }
          that.iframeLoaded();
        }, 1000);
      });
    },
    //更改通道数组
    iChannelIDChange() {
      console.log(666, this.iChannelID, this.iChannelIDWindow);
      //判断是否和正在播放的通道一致
      for (let i = 0; i < this.iChannelID.length; i++) {
        if (this.iChannelID[i] != this.iChannelIDWindow[i]) {
          //为undefined停止播放
          if (this.iChannelID[i] == undefined) {
            //更改正在播放通道
            this.iChannelIDWindow[i] = this.iChannelID[i];
            this.StopRealPlay(i);
          } else {
            if (this.iChannelIDWindow[i] == undefined) {
              //更改正在播放通道
              this.iChannelIDWindow[i] = this.iChannelID[i];
              //播放
              this.clickStartRealPlay(this.iChannelID[i], i);
            }
          }
        }
      }
    },
    //开始播放
    clickStartRealPlay(iChannelID, iWndIndex) {
      console.log(1111111);

      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);

        if ('undefined' === typeof iWndIndex) {
          iWndIndex = that.g_iWndIndex;
        }

        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(iWndIndex),
          szDeviceIdentify = that.nvripList[0].szIP + '_' + that.nvripList[0].szPort,
          iRtspPort = that.nvripList[0].iRtspPort,
          bZeroChannel = false,
          szInfo = '';

        if ('undefined' === typeof iChannelID) {
          iChannelID = that.iChannelID[0];
        }

        // var monitorList = that.monitorList[that.nvripList[that.indexActive].szIP];
        // var monitor = monitorList.filter((item) => {
        //   return item.channelAnalog == iChannelID;
        // });
        // var iStreamType = monitor[0] && monitor[0].streamType ? monitor[0].streamType * 1 : that.nvripList[0].iStreamType * 1;
        var iStreamType = that.nvripList[0].iStreamType * 1;

        if (null == szDeviceIdentify) {
          return;
        }
        var startRealPlay = function () {
          clearTimeout(that.timer);
          oWebVideoCtrl.I_StartRealPlay(szDeviceIdentify, {
            iWndIndex: iWndIndex,
            iRtspPort: iRtspPort,
            iStreamType: iStreamType,
            iChannelID: iChannelID,
            bZeroChannel: bZeroChannel,
            success: function () {
              szInfo = '预览成功！';
              //   that.$message.success(szInfo);

              useMessage().createMessage.success(szInfo);
            },
            error: function (status, xmlDoc) {
              if (403 === status) {
                szInfo = '设备不支持Websocket取流！';
              } else {
                szInfo = '预览失败！';
              }

              useMessage().createMessage.warning(szInfo);
              //   that.$message.warning(szInfo);
              // showOPInfo(szDeviceIdentify + ' ' + szInfo)
            },
          });
        };

        if (oWndInfo != null) {
          // 已经在播放了，先停止
          oWebVideoCtrl.I_Stop({
            success: function () {
              startRealPlay();
            },
          });
        } else {
          startRealPlay();
        }
      });
    },
    //停止播放
    StopRealPlay(g_iWndIndex) {
      console.log(3333333);
      console.log(g_iWndIndex);

      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);

        // var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(g_iWndIndex);
        // if (oWndInfo != null) {
        oWebVideoCtrl.I_Stop({
          iWndIndex: g_iWndIndex,
          success: function () {},
          error: function () {},
        });
        // }
      });
    },

    // PTZ控制 9为自动，1,2,3,4,5,6,7,8为方向PTZ
    mouseDownPTZControl(iPTZIndex) {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);

        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex),
          bZeroChannel = false,
          iPTZSpeed = that.speed;

        if (bZeroChannel) {
          // 零通道不支持云台
          return;
        }
        // console.log(oWndInfo)
        if (oWndInfo != null) {
          if (9 == iPTZIndex && that.g_bPTZAuto) {
            iPTZSpeed = 0; // 自动开启后，速度置为0可以关闭自动
          } else {
            that.g_bPTZAuto = false; // 点击其他方向，自动肯定会被关闭
          }
          oWebVideoCtrl.I_PTZControl(iPTZIndex, false, {
            iPTZSpeed: iPTZSpeed,
            success: function (xmlDoc) {
              if (9 == iPTZIndex && that.g_bPTZAuto) {
              } else {
              }
              if (9 == iPTZIndex) {
                that.g_bPTZAuto = !that.g_bPTZAuto;
              }
            },
            error: function (status, xmlDoc) {
              //   that.$message.warning('开启云台失败，设备不支持');
              useMessage().createMessage.warning('开启云台失败，设备不支持');
            },
          });
        }
      });
    },
    // 方向PTZ停止
    mouseUpPTZControl() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);

        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);

        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(1, true, {
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });
        }
      });
    },
    // 放大 +
    PTZZoomIn() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(10, false, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {
              useMessage().createMessage.warning('操作失败，设备不支持');
              //   that.$message.warning('操作失败，设备不支持');
            },
          });
        }
      });
    },
    // 放大 -
    PTZZoomout() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(11, false, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {
              useMessage().createMessage.warning('操作失败，设备不支持');
              //   that.$message.warning('操作失败，设备不支持');
            },
          });
        }
      });
    },
    // 放大停止
    PTZZoomStop() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(11, true, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });
        }
      });
    },
    // 光圈 +
    PTZIrisIn() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(14, false, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {
              //   that.$message.warning('操作失败，设备不支持');
              useMessage().createMessage.warning('操作失败，设备不支持');
            },
          });
        }
      });
    },
    // 光圈 -
    PTZIrisOut() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(15, false, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {
              //   that.$message.warning('操作失败，设备不支持');
              useMessage().createMessage.warning('操作失败，设备不支持');
            },
          });
        }
      });
    },
    // 光圈停止
    PTZIrisStop() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(14, true, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });
        }
      });
    },
    // 变焦 +
    PTZFocusIn() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(12, false, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {
              that.$message.warning('聚焦失败，设备不支持');
            },
          });
        }
      });
    },
    // 变焦 -
    PTZFoucusOut() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(13, false, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {
              //   that.$message.warning('聚焦失败，设备不支持');
              useMessage().createMessage.warning('操作失败，设备不支持');
            },
          });
        }
      });
    },
    // 变焦停止
    PTZFoucusStop() {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex);
        if (oWndInfo != null) {
          oWebVideoCtrl.I_PTZControl(12, true, {
            iWndIndex: that.g_iWndIndex,
            success: function (xmlDoc) {},
            error: function (status, xmlDoc) {},
          });
        }
      });
    },
    // 开始录像
    clickStartRecord(szType) {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(that.g_iWndIndex),
          szInfo = '';

        if (oWndInfo != null) {
          oWebVideoCtrl.I_StartRecord('szFileName', {
            bDateDir: true, //是否生成日期文件
            success: function () {},
            error: function () {},
          });
        }
      });
    },
    // 停止录像
    clickStopRecord(iWndIndex) {
      var that = this;
      $.each(this.g_aIframe, (i, oIframe) => {
        var oWebVideoCtrl = that.getWebVideoCtrl(oIframe);
        if ('undefined' === typeof iWndIndex) {
          iWndIndex = that.g_iWndIndex;
        }
        var oWndInfo = oWebVideoCtrl.I_GetWindowStatus(iWndIndex),
          szInfo = '';

        if (oWndInfo != null) {
          oWebVideoCtrl.I_StopRecord({
            success: function () {},
            error: function () {},
          });
        }
      });
    },
  },
};
</script>
 
<style lang="less" scoped>
.plugin {
  width: 100%;
  height: 400px;
}

iframe {
  margin: 0;
  padding: 0;
  border: 0;
  width: 100%;
  height: 100% !important;
}
</style>